<template>
	<!-- 团购标题 -->
	<view class="group_title">
		<view class="group_title_text">北京四日追花拍摄秘籍——故宫</view>
	</view>
	
	
	<!-- 社团信息 -->
	<view class="community_info">
		<view class="community_info_name">济源广播旅游团</view>
		<view class="community_info_time">2022/10/10 11:09</view>
	</view>
	
	<!-- 团购图片 -->
	<view class="group_img">
		<img class="group_img_img" src="https://i3.3conline.com/images/piclib/201003/05/batch/1/56233/1267723169949451105fdl4.jpg" alt="" />
	</view>
	
	
	<!-- 团购文章信息 -->
	<view class="group_article">
		<view class="group_article_text">为了丰富小区业主周末生活...</view>
		<view class="group_article_info">
			<view><text>价格:￥99.00&ensp;&ensp;&ensp;&ensp;&ensp;</text> <text style="text-decoration-line:line-through;color: red;">原价:￥199.00</text></view>
			<view>截至日期: 2022-10-10 23:59</view>
			<view>咨询电话: 0379-66666666</view>
			<view>注意事项: 暂无</view>
		</view>
	</view>
</template>

<script setup>
		import fuiIcon from "@/component/firstui/firstui/fui-icon/fui-icon.vue"
</script>

<style lang="scss" scoped>
	
	// 团购标题信息
	.group_title{
		width: 100vw;
		height:10vh;
		overflow: hidden;
		padding: 0px 10vw;
		.group_title_text{
			width: 100vw;
			margin: 3.5vh auto;
			font-size: 20px;
		}
	}
	
	
	// 社团信息
	.community_info{
		width: 100vw;
		height: 3.5vh;
		display: flex;
		flex-wrap: wrap;
		justify-content: space-between;
		padding: 0px 2vw;
		// 社团名字
		.community_info_name{
		}
		.community_info_time{
		}
	}
	
	// 团购图片
	.group_img{
		width: 100vw;
		height: 25vh;
		background-color: seagreen;
		.group_img_img{
			width: 100%;
			height: 100%;
		}
	}
	
	//团购文章信息
	.group_article{
		width: 100vw;
		height: 25vh;
		overflow: hidden;
		.group_article_text{
		padding: 1.5vh 3vw;
		}
		// 团购价格信息和联系方式
		.group_article_info{
			width: 85vw;
			height: 15vh;
			margin: 1vh auto;
			display: flex;
			flex-wrap: wrap;
			flex-direction: column;
			justify-content: space-between;
		}
	}
</style>